<template>
  <div class="page-container" v-loading="loading" v-loadingCommonStyle>


    <ex_header_spiler :title="$tt('label_base_info')" />
    <ex_super_desc v-bind="baseOption" :data="form">
    </ex_super_desc>
    <ex_header_spiler :title="$tt('label_sku_list')" />
    <ex_super_table :model="tableModel" :data="form.orderProductList" size="default" />
  </div>
</template>
<script>
import router_params from '@/mixin/router_params';

let defaultObj = {

}
export default {

  mixins: [router_params],
  components: {},


  data() {
    return {
      loading: false,
      form: _.cloneDeep(defaultObj),
      baseOption: {
        attrs: this.$defaultDetailDescAttrs,
        model: [
          { key: 'orderNumber', label: 'label_order_code', },
          { key: 'postingNumber', label: 'label_platform_code', },
          { key: 'parentPostingNumber', label: '母单编号', 'show-overflow-tooltip': true, },
          // { key: 'postingNumber', label: '货件号', },

          { key: 'status', label: 'label_freight_status', 'show-overflow-tooltip': true, },
          { key: 'substatus', label: 'label_freight_sub_status', 'show-overflow-tooltip': true, },
          { key: 'trackingNumber', label: 'label_track_code', 'show-overflow-tooltip': true, },
          {
            key: 'orderStatus', label: 'label_status', 'show-overflow-tooltip': true,
            formatter: (r, c, v, i) => this.$enumShow(v, "SrmOrderStatusEnum")
          },
          {
            key: 'exceptionMsg', label: 'label_exception_info',
            render: (h, { data, item }) => {
              const code = data[item.key]
              if (!code) return this.$tt('data_temp_none')
              return (<text_extra_tooltip_operate position_relative
                value={code} ellipsis
                data_type={item.key} data_id={item.id}
              />)
            },
          },
          {
            key: 'status', label: 'label_status', 'width': 120, 'show-overflow-tooltip': true,
            // formatter: (r, c, v, i) => this.$enumShow(v, "ReturnOrderStatusEnum")
          },


          { key: 'cancelReason', label: 'label_cancel_reason', 'width': 100, },
          { key: 'customerAddress', label: 'label_consignee_address', 'width': 100, },

          { key: 'customerEmail', label: 'label_consignee_person_email', 'width': 100, },
          { key: 'customerName', label: 'label_consignee_person_name', },
          { key: 'customerPhone', label: 'label_consignee_person_phone', },
          { key: 'customerRegion', label: 'label_consignee_province', },
          { key: 'customerCity', label: 'label_consignee_city', },
          { key: 'customerCountry', label: 'label_consignee_country', },
          { key: 'customerDistrict', label: 'label_consignee_address', },

          { key: 'customerZipCode', label: 'label_consignee_postcode', },
          { key: 'warehouseName', label: 'label_warehouse_name', },

        ],
      },
      tableModel: [

        //{ key: 'height', label: 'label_height', 'width': 120, 'show-overflow-tooltip': true, },
        //{
        //  key: 'length', label: 'label_length', 'width': 120, 'show-overflow-tooltip': true,
        //},
        //{
        //  key: 'weight', label: 'label_weight', 'width': 120, 'show-overflow-tooltip': true,
        //},
        //{
        //  key: 'width', label: 'label_width', 'width': 120, 'show-overflow-tooltip': true,
        //},

        { key: 'sku', label: 'label_platform_product_code', 'width': 120, 'show-overflow-tooltip': true, },
        { key: 'skuBarcode', label: 'label_sku_code', 'width': 120, 'show-overflow-tooltip': true, },
        {
          key: 'skuOnlyCode', label: 'label_sku_only_code', 'width': 220,
        },
        { key: 'skuNameCn', label: 'label_name', 'width': 120, 'show-overflow-tooltip': true, },
        { key: 'quantity', label: 'label_count', 'min-width': 120, 'show-overflow-tooltip': true, },

      ],
    };
  },



  methods: {
    init_data_default(into_params) {
      if (into_params.id) {
        this.loading = true
        this.$ajax({
          url: this.$url['srm/OzonOrderSyncDetail'],
          method: 'post',
          data: { id: into_params.id },
          success: (res) => {
            this.form = Object.assign({}, _.cloneDeep(defaultObj), res.data)
            this.fixTabLabel()
          },
          complete: () => {
            this.loading = false

          }

        })
      }
      this.fixTabLabel()
    },
    fixTabLabel() {
      if (!!this.form.orderNumber) {
        this.$emit("tagModifyLabel", { _key: 'label_name_code', name: this.$tt('label_ozon_order_detail'), code: this.form.orderNumber || "" })

      } else {
        this.$emit("tagModifyLabel", "label_ozon_order_detail")
      }
    },
  }
};

</script>
<style></style>
